@import "~./atlantic/zul/less/_header.less";

//reset table
.resetTable() {
	table {
		border-spacing: 0;
		th, td {
			background-clip: padding-box;
			padding: 0;
		}
		th {
			text-align: inherit;
		}
	}
}

//grid
.z-grid {
	border: 1px solid @baseBorderColor;
	overflow: hidden;
	zoom: 1;
	//grid header
	&-header {
		width: 100%;
		background: @meshTitleBackground;
		overflow: hidden;
		.resetTable();
	}
	&-header-border {
		border-bottom: 1px solid @baseBorderColor;
		margin-top: -1px;
		position: relative;
	}
	//grid body
	&-body {
		margin-top: auto;
		position: relative;
		overflow: hidden;
		.resetTable();
	}
	&-emptybody td {
		.fontStyle(@contentFontFamily, @baseFontSize, @baseFontWeight, @meshEmptyColor);
		font-style: italic;
		padding: @paddingSmall @paddingSize !important;
		line-height: @buttonHeight - @paddingSmall * 2;
		text-align: center;
	}
	//grid footer
	&-footer {
		border-top: 1px solid @baseBorderColor;
		background: @meshFootBackground;
		overflow: hidden;
		.resetTable();
		
		.z-footer {
			overflow: hidden;
		}
	}
	&-odd > .z-row-inner,
	&-odd > .z-cell {
		background: @meshStripeBackground;
	}
}
//column
.z-columns {
	&:first-child th {
		border-top-width: 0;
	}
	th:first-child {
		border-left-width: 0;

		// B50-3306729: the first header should have border-left when the first column is covered with other header
		&.z-columns-border {
			border-left: 1px solid @meshTitleBorderColor;
		}
	}
	&-bar {
		border-top: 1px solid @meshTitleBorderColor;
		border-left: 1px solid @meshTitleBorderColor;
	}
}
.z-column {
	border-top: 1px solid @meshTitleBorderColor;
	border-left: 1px solid @meshTitleBorderColor;
	padding: 0;
	background: meshTitleBackground;
	position: relative;
	overflow: hidden;
	white-space: nowrap;
	
	&-hover .z-column-button {
		display: block;
	}
	&-sort {
		.z-column-content {
			cursor: pointer;
		}
		.z-column-sorticon {
			.iconFontStyle(@baseFontSize, @meshTitleColor);
			line-height: normal;
			position: absolute;
			top: 0;
			left: 50%;
		}
	}
	&-button {
		color: @meshTitleColor;
		.displaySize(none, @headerWidth, @headerHeight - 1);
		border-left: 1px solid @meshTitleBorderColor;
		line-height: @headerHeight;
		text-align: center;
		position: absolute;
		top: 0;
		right: 0;
		text-decoration: none;
		z-index: 15;
		cursor: pointer;
		
		&:hover {
			background: @meshMenuHoverBackground;
		}
	}
	&-sizing,
	&-sizing .z-column-button,
	&-sizing.z-column-sort .z-column-button {
		cursor: e-resize;
	}
}
//row and cell
.z-row {
	&:first-child {
		.z-row-inner,
		.z-cell {
			border-top-width: 0;
		}
		.z-row-content,
		.z-group-content {
			padding-top: @paddingSmall;
		}
	}
	.z-row-inner,
	.z-cell {
		border-top: 1px solid baseBorderColor;
		background: @baseBackground;
		overflow: hidden;
	}
	&:hover {
		> .z-row-inner,
		> .z-cell {
			background: @hoverBackground;
		}
		> .z-row-inner > .z-row-content { //for nest issue
			color: @hoverColor;
		}
	}
}
//Group
.z-group {
	&-inner {
		border-top: 1px solid @groupBorderColor;
		background: @groupBackground;
		overflow: hidden;
		
		.z-group-content,
		.z-cell {
			padding: @paddingSmall - 1 @paddingSmall @paddingSmall;
		}
	}
	&:first-child {
		.z-group-inner {
			border-top-width: 0;
		}
	}
	&-icon {
		.iconFontStyle(@fontSizeLarge, @baseTextColor);
		.displaySize(inline-block, @iconWidth, @iconHeight);
		text-align: center;
		vertical-align: top;
		position: relative;
		cursor: pointer;
	}
}
.z-groupfoot-inner {
	border-top: 1px solid @baseBorderColor;
	background: @groupFootBackground;
	overflow: hidden;
}
//content
.z-column-content {
	.fontStyle(@titleFontFamily, @meshTitleFontSize, @fontWeightSemiBold, @meshTitleColor);
	padding: @paddingSmall @paddingSize;
	line-height: @headerHeight - @paddingSmall * 2;
	position: relative;
	overflow: hidden;
}
.z-row-content,
.z-group-content,
.z-groupfoot-content,
.z-footer-content {
	.fontStyle(@contentFontFamily, @baseFontSize, @baseFontWeight, @baseTextColor);
	padding: @paddingSmall - 1 @paddingSmall @paddingSmall;
	line-height: @buttonHeight - @paddingSmall * 2;
	overflow: hidden;
}
.z-group-content,
.z-groupfoot-content,
.z-footer-content {
	line-height: @barHeight - @paddingSmall * 2;
}
.z-group-content,
.z-groupfoot-content {
	.z-label {
		font-weight: @fontWeightSemiBold;
	}
}
//Cell Content
.z-grid-body .z-cell {
	.fontStyle(@contentFontFamily, @baseFontSize, @baseFontWeight, @baseTextColor);
	padding: @paddingSmall;
	line-height: @barHeight - @paddingSmall * 2;
	overflow: hidden;
}
//paging
.z-grid-paging {
	&-top {
		overflow: hidden;
		width: 100%;

		.z-paging {
			border: none;
			border-bottom: 1px solid @baseBorderColor;
		}
	}
	&-bottom {
		overflow: hidden;
		width: 100%;

		.z-paging {
			border: none;
			border-top: 1px solid @baseBorderColor;
		}
	}
}
//column menu
.z-columns-menugrouping .z-menuitem-image {
	.encodeThemeURL(background-image, '~./zul/img/grid/menu-group.png');
}
.z-columns-menuungrouping .z-menuitem-image {
	.encodeThemeURL(background-image, '~./zul/img/grid/menu-ungroup.png');
}
.z-columns-menuascending .z-menuitem-image {
	.encodeThemeURL(background-image, '~./zul/img/grid/menu-arrowup.png');
}
.z-columns-menudescending .z-menuitem-image {
	.encodeThemeURL(background-image, '~./zul/img/grid/menu-arrowdown.png');
}
